import 'package:badges/badges.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:hzcloud_flt/common/hz_test_widget.dart';

class MinePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createStater
    return _MinePageState();
  }
}

class _MinePageState extends State<MinePage> {
  List _dataSource;

  @override
  void initState() {
    // TODO: implement initState
    _dataSource = [
      [
        {"title": "收藏夹", "icon": "assets/images/collection.png"},
        {"title": "电子钱包", "icon": "assets/images/jifen.png"},
        {"title": "实名认证", "icon": "assets/images/smauth.png"},
        {"title": "家庭成员", "icon": "assets/images/family.png"}
      ],
      [
        {"title": "帮助与反馈", "icon": "assets/images/collection.png"},
        {"title": "设置", "icon": "assets/images/shezhi.png"},
      ]
    ];
    super.initState();
  }

  Widget _renderItem(BuildContext context, int section, int index) {
    List dataSource = _dataSource[section];
    Map data = dataSource[index];
    return MineMenuItem(
      data: data,
      onTap: () {
        Navigator.of(context).push(CupertinoPageRoute(builder: (context) {
          return HZTextPage();
        }));
      },
    );
  }

  Widget build(Object context) {
    // TODO: implement build
    return Scaffold(
      backgroundColor: Colors.white,
      body: SafeArea(
        child: CustomScrollView(
          slivers: [
            SliverToBoxAdapter(
              child: Container(
                color: Colors.white,
                padding: EdgeInsets.only(left: 15, right: 15),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Padding(
                      padding: EdgeInsets.symmetric(vertical: 15),
                      child: Text(
                        '个人中心',
                        style: TextStyle(
                          fontSize: 20,
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ),
                    Row(
                      children: [
                        Image.asset(
                          'assets/images/dman.png',
                          width: 60,
                          fit: BoxFit.fill,
                        ),
                        Expanded(
                          child: Padding(
                            padding: EdgeInsets.only(left: 12),
                            child: Text(
                              '我的昵称',
                              style: TextStyle(
                                fontSize: 16,
                                color: Colors.black,
                                fontWeight: FontWeight.w500,
                              ),
                            ),
                          ),
                        ),
                        GestureDetector(
                          onTap: () {},
                          child: Container(
                            height: 40,
                            child: Image.asset(
                              'assets/images/bianji.png',
                              height: 20,
                              width: 20,
                            ),
                          ),
                        )
                      ],
                    ),
                    Container(
                      height: 70,
                      margin: EdgeInsets.only(top: 15),
                      padding: EdgeInsets.symmetric(horizontal: 15),
                      width: MediaQuery.of(context).size.width,
                      decoration: BoxDecoration(
                        image: DecorationImage(
                          image: AssetImage('assets/images/moverify.png'),
                          fit: BoxFit.fill,
                        ),
                      ),
                      child: Row(
                        children: [
                          Image.asset('assets/images/hz1.png'),
                          Expanded(
                            child: Text(
                              '日照测试物业区域',
                              style: TextStyle(
                                fontSize: 16,
                                color: Colors.white,
                                fontWeight: FontWeight.w500,
                              ),
                            ),
                          ),
                          Image.asset('assets/images/next_arrow.png')
                        ],
                      ),
                    )
                  ],
                ),
              ),
            ),
            SliverFixedExtentList(
              delegate: SliverChildBuilderDelegate(
                (context, index) => _renderItem(context, 0, index),
                childCount: _dataSource[0].length,
              ),
              itemExtent: 50,
            ),
            SliverToBoxAdapter(
              child: Container(
                height: 10,
                color: Color(0xFFF2F2F2),
              ),
            ),
            SliverFixedExtentList(
              delegate: SliverChildBuilderDelegate(
                  (context, index) => _renderItem(context, 1, index),
                  childCount: _dataSource[1].length),
              itemExtent: 50,
            )
          ],
        ),
      ),
    );
  }
}

class MineMenuItem extends StatelessWidget {
  final Map data;
  final Function onTap;

  const MineMenuItem({Key key, this.data, this.onTap}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return InkWell(
      onTap: onTap,
      child: Container(
        decoration: BoxDecoration(
          border: Border(
            bottom: BorderSide(color: Color(0xFFe2e2e2), width: 0.5),
          ),
        ),
        child: Padding(
          padding: EdgeInsets.symmetric(horizontal: 15),
          child: Row(
            children: [
              Image.asset(
                data["icon"],
                height: 20,
              ),
              Expanded(
                child: Padding(
                  padding: EdgeInsets.only(left: 10),
                  child: Text(
                    '${data["title"]}',
                    style: TextStyle(fontSize: 17),
                  ),
                ),
              ),
              Badge(
                padding: EdgeInsets.symmetric(horizontal: 7.5),
                shape: BadgeShape.square,
                badgeColor: Color(0xFFE83C36),
                borderRadius: BorderRadius.circular(15),
                badgeContent: Text(
                  '12',
                  style: TextStyle(fontSize: 15, color: Colors.white),
                ),
                toAnimate: false,
              ),
              Image.asset('assets/images/next_arrow.png'),
            ],
          ),
        ),
      ),
    );
  }
}
